<template>
	<!-- :style="{'backgroundImage': 'url('+background_img+'/upload/platformBackGround.png)'}" -->
	<view class="login">
		<view class="title">
			<view class="">
				<view class="title_t mb15">你好，</view>
				<view class="title_t">欢迎使用盐外校安精灵系统</view>
			</view>
		</view>
		<view class="body">
			<view class="body-title">手机号</view>
			<view class="number base">
				<input type="digit" v-model="number" placeholder="请输入账号">
			</view>
			<view class="body-title">密码</view>
			<view class="password base">
				<input class="uni-input" v-model="password" placeholder="请输入密码" :password="showPassword">
				<text class="iconfont" :class="[!showPassword ? 'icon-yanjing-copy-copy' : 'icon-biyanjing1-copy']"
					@click="changePassword"></text>
			</view>
			<u-button class="mt50" type="primary" shape="circle" size="large" text="登 录" color="#007aff" @click="login">
			</u-button>
		</view>
	</view>
</template>

<script>
	import {
		login,
		rePwd
	} from "@/api/index.js"
	import {
		mapGetters,
		mapMutations
	} from 'vuex'
	export default {
		data() {
			return {
				background_img: 'http://101.133.170.49:85',
				number: "",
				password: "",
				newPassword: null,
				newPwdCode: false,
				showPassword: true,
			}
		},
		computed: {
			// ...mapGetters(['getUser']),
		},
		onLoad() {
		},
		methods: {
			goPage(e) {
				let tabControl = 0
				if (e == 0) {
					tabControl = 0
				} else if (e == 1) {
					tabControl = 1
					uni.setStorageSync('type', 1)
				} else if (e == 2) {
					tabControl = 1
					uni.setStorageSync('type', 2)
				} else if (e == 3) {
					uni.setStorageSync('type', 3)
					tabControl = 2
				}
				uni.setStorageSync('tabControl', tabControl)
			},

			changePassword: function() {
				this.showPassword = !this.showPassword;
			},

			// 登录
			login() {
				let _this = this
				if (this.number && this.password) {
					let val = {
						accountPhone: _this.number,
						accountPassword: _this.password,
						projectCode: 'XMBM2407124938683'
					}
					login(val).then((res => {
						uni.showToast({
							duration: 1000,
							icon: "success",
							title: "登录成功"
						})
						const userInfo = {
							userName: res.object.user.userName,
							userCode: res.object.user.userCode,
							roleName: res.object.user.roleName,
							roleCode: res.object.user.roleCode,
							projectCode: res.object.user.projectCode,
						}
						uni.setStorageSync('userInfo', userInfo)
						let sjc = new Date().getTime()
						uni.setStorageSync('logoutTime', sjc + 172800000)
						uni.reLaunch({
							url: '/pages/index/index'
						})
					}))
				} else {
					uni.showToast({
						duration: 1000,
						title: '账号密码不能为空',
						icon: 'none'
					})
				}
			},

			// 修改密码
			remakePwd() {
				let _this = this
				const {
					id,
					isFirstPwd,
					userType
				} = uni.getStorageSync('carUserInfo')
				let val = {
					id: id,
					pwd: _this.newPassword
				}
				rePwd(val).then(res => {
					console.log(res);
					uni.showToast({
						duration: 1500,
						icon: "success",
						title: "修改成功"
					})

					setTimeout(() => {
						uni.reLaunch({
							url: '/pages/role/index'
						})
					}, 1500)
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.login {
		height: 100vh;
		width: 100%;
		box-sizing: border-box;
		background: url('/static/img/login/login_bg.png') navy;
		background-size: 100% 100%;
		background-attachment: fixed;
	}

	.title {
		display: flex;
		align-items: flex-end;
		margin: 0 auto;
		height: 22%;
		width: 100%;
		padding: 0 44upx;

		.title_t {
			font-size: 44upx;
			font-family: Source Han Sans CN, Source Han Sans CN-Bold;
			font-weight: 700;
			color: #ffffff;
		}
	}

	.body {
		// position: relative;
		padding: 20upx 44upx;
		margin: 20% auto 0;
		width: 100%;
		height: 50%;
		// background: #FFFFFF;
		// box-shadow: 1px 2px 8px 1px rgba(24, 45, 184, 0.55);
		border-radius: 40upx;
		box-sizing: border-box;

		.body-title {
			font-size: 36upx;
			font-weight: 700;
			color: #333333;
			font-family: Source Han Sans CN, Source Han Sans CN-Medium;
		}

		.base {
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 0 24upx;
			box-sizing: border-box;
			width: 100%;
			height: 100upx;
			border-bottom: 0.5px solid #dcdcdc;
			margin: 44upx auto 64upx auto;
		}
	}

	.mt50 ::v-deep .u-button__text {
		font-size: 36upx !important;
		font-weight: 500;
		font-family: Source Han Sans CN, Source Han Sans CN-Medium;
	}
</style>